<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>test16</title>
		<style>
			body
			{
				background-color: black;
			}
			#d1
			{
				height: 1000px;
				width: 1600px;
			}
			#d1d1
			{
				position: absolute;
				top: 280px;
				left: 420px;
				width: 1000px;
				font-size: 80px;
				color: aqua;
			}
			#d1d2
			{
				position: absolute;
				top: 280px;
				left: 420px;
				transition: 1.5s;
				transition-delay: 1s;
			}
			#d1d2d1
			{
				position: relative;
				height: 100px;
				width: 400px;
				background-color: black;
			}
			#d1d2d2
			{
				position: relative;
				top: 0px;
				left: -20px;
				height: 10px;
				width: 440px;
				background-color: transparent;
				border-radius: 20px;
				transition: 1s;
			}
			#d1:hover #d1d2d2
			{
				background-color: aqua;
			}
			#d1:hover #d1d2
			{
				top: 180px;
			}
			#d1d3
			{
				position: absolute;
				top: 400px;
				left: 420px;
				width: 1000px;
				font-size: 80px;
				color: orangered;
			}
			#d1d4
			{
				position: absolute;
				top: 400px;
				left: 420px;
				transition: 1s;
				transition-delay: 3s;
			}
			#d1d4d1
			{
				position: relative;
				left: 0px;
				height: 100px;
				width: 330px;
				background-color: black;
				float: left;
			}
			#d1d4d2
			{
				position: relative;
				top: -10px;
				left: 330px;
				height: 120px;
				width: 10px;
				background-color: transparent;
				border-radius: 20px;
				transition: 0.5s;
				transition-delay: 2.5s;
			}
			#d1:hover #d1d4d2
			{
				background-color: orangered;
			}
			#d1:hover #d1d4
			{
				left: 80px;
			}
			#d1d5
			{
				position: absolute;
				top: 630px;
				left: 420px;
				width: 800px;
				font-size: 80px;
				color: gold;
				letter-spacing: 50px;
			}
			#d1d6
			{
				position: absolute;
				top: 630px;
				left: 420px;
				transition: 1s;
				transition-delay: 4.5s;
			}
			#d1d6d1
			{
				position: relative;
				height: 100px;
				width: 400px;
				background-color: transparent;
			}
			#d1d6d2
			{
				position: relative;
				top: 0px;
				left: -20px;
				height: 10px;
				width: 640px;
				background-color: transparent;
				border-radius: 20px;
				transition: 0.5s;
				transition-delay: 4s;
			}
			#d1:hover #d1d6d2
			{
				background-color: gold;
			}
			#d1:hover #d1d6
			{
				top: 530px;
			}
			#d1d5d2
			{
				position: absolute;
				top: 0px;
				left: 0px;
				transition: 1s;
				transition-delay: 5.5s;
			}
			#d1d5d2d1
			{
				position: relative;
				height: 100px;
				width: 100px;
				background-color: black;
			}
			#d1d5d2d2
			{
				position: relative;
				top: 0px;
				left: -10px;
				height: 10px;
				width: 120px;
				background-color: transparent;
				border-radius: 20px;
				transition: 0.5s;
				transition-delay: 5s;
			}
			#d1:hover #d1d5d2d2
			{
				background-color: red;
			}
			#d1:hover #d1d5d2
			{
				top: -90px;
			}
			#d1d5d3
			{
				position: absolute;
				top: 0px;
				left: 125px;
				transition: 1s;
				transition-delay: 6s;
			}
			#d1d5d3d1
			{
				position: relative;
				height: 100px;
				width: 100px;
				background-color: black;
			}
			#d1d5d3d2
			{
				position: relative;
				top: 0px;
				left: -10px;
				height: 10px;
				width: 120px;
				background-color: transparent;
				border-radius: 20px;
				transition: 0.5s;
				transition-delay: 5.5s;
			}
			#d1:hover #d1d5d3d2
			{
				background-color: yellow;
			}
			#d1:hover #d1d5d3
			{
				top: -90px;
			}
			#d1d5d4
			{
				position: absolute;
				top: 0px;
				left: 250px;
				transition: 1s;
				transition-delay: 6.5s;
			}
			#d1d5d4d1
			{
				position: relative;
				height: 100px;
				width: 100px;
				background-color: black;
			}
			#d1d5d4d2
			{
				position: relative;
				top: 0px;
				left: -10px;
				height: 10px;
				width: 120px;
				background-color: transparent;
				border-radius: 20px;
				transition: 0.5s;
				transition-delay: 6s;
			}
			#d1:hover #d1d5d4d2
			{
				background-color: green;
			}
			#d1:hover #d1d5d4
			{
				top: -90px;
			}
			#d1d5d5
			{
				position: absolute;
				top: 0px;
				left: 375px;
				transition: 1s;
				transition-delay: 7s;
			}
			#d1d5d5d1
			{
				position: relative;
				height: 100px;
				width: 100px;
				background-color: black;
			}
			#d1d5d5d2
			{
				position: relative;
				top: 0px;
				left: -10px;
				height: 10px;
				width: 120px;
				background-color: transparent;
				border-radius: 20px;
				transition: 0.5s;
				transition-delay: 6.5s;
			}
			#d1:hover #d1d5d5d2
			{
				background-color: blue;
			}
			#d1:hover #d1d5d5
			{
				top: -90px;
			}
			#d1d5d6
			{
				position: absolute;
				top: 0px;
				left: 500px;
				transition: 1s;
				transition-delay: 7.5s;
			}
			#d1d5d6d1
			{
				position: relative;
				height: 100px;
				width: 100px;
				background-color: black;
			}
			#d1d5d6d2
			{
				position: relative;
				top: 0px;
				left: -10px;
				height: 10px;
				width: 120px;
				background-color: transparent;
				border-radius: 20px;
				transition: 0.5s;
				transition-delay: 7s;
			}
			#d1:hover #d1d5d6d2
			{
				background-color: purple;
			}
			#d1:hover #d1d5d6
			{
				top: -90px;
			}
		</style>
	</head>
	<body>
		<div id="d1">
			<div id="d1d1">教师节快乐</div>
			<div id="d1d2">
				<div id="d1d2d1"></div>
				<div id="d1d2d2"></div>
			</div>
			<div id="d1d3">祝老师们</div>
			<div id="d1d4">
				<div id="d1d4d1"></div>
				<div id="d1d4d2"></div>
			</div>
			<div id="d1d5">
				<div id="d1d5d1">天天加薪!</div>
				<div id="d1d5d2">
					<div id="d1d5d2d1"></div>
					<div id="d1d5d2d2"></div>
				</div>
				<div id="d1d5d3">
					<div id="d1d5d3d1"></div>
					<div id="d1d5d3d2"></div>
				</div>
				<div id="d1d5d4">
					<div id="d1d5d4d1"></div>
					<div id="d1d5d4d2"></div>
				</div>
				<div id="d1d5d5">
					<div id="d1d5d5d1"></div>
					<div id="d1d5d5d2"></div>
				</div>
				<div id="d1d5d6">
					<div id="d1d5d6d1"></div>
					<div id="d1d5d6d2"></div>
				</div>
			</div>
			<div id="d1d6">
				<div id="d1d6d1"></div>
				<div id="d1d6d2"></div>
			</div>
		</div>
	</body>
</html>